<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
	<style>
		.box{
			width:100px; height:100px; background:red;
		}
		.box22{
			background:yellowgreen; width:100px; height:300px;
		}
	</style>
 </head>
 <body>
		<img src="img/1.jpg" id="photo"/>
		<a href="http://www.baidu.com" id="link">百度</a>
		<input type="text" id="txt" value="哈哈" />
		<div class="box" id="box" haha="你好" style="border:2px solid green;"></div>
 </body>
</html>
<script>
	//获取元素
	var oImg = document.getElementById('photo');
	var oLink = document.getElementById('link');
	var oTxt = document.getElementById('txt');
	var oBox = document.getElementById('box');

	//关于自定义属性
	console.log(oBox.haha);//undefined
	console.log(oBox.getAttribute('haha'));//你好
	
	//关于行间样式得到的类型不同
	console.log(typeof oBox.style);//object
	console.log(typeof oBox.getAttribute('style'));//string
</script>
